<!DOCTYPE html>
<html>
	<head>
		
		<title>jquery.menubar.js demo</title>
		
		<script type="text/javascript" src="jquery-1.6.1.min.js"></script>
		<script type="text/javascript" src="jquery-ui-1.8.11.custom.min.js"></script>
		<script type="text/javascript" src="../jquery.cursoricon.js"></script>
		
		<link rel="stylesheet" type="text/css" href="custom-theme/jquery-ui-1.8.11.custom.css">
		<link rel="stylesheet" type="text/css" href="jquery.ui.override.css">
		<link rel="stylesheet" type="text/css" href="jquery.cursoricon.css">
		
		<style>
			body { padding: 0; margin: 2em; font: 14px helvetica neue, arial; }
			* { outline: none; }
			table { width: 100%; }
			td { width: 33.33%; border: 1px solid #888; height: 8em; text-align: center; }
		</style>
		
		<script type="text/javascript">
			$(function(){
				$("td").each(function(){
					var id = $(this).attr("id");
					$(this).cursoricon({
						classes: id + " ui-icon"
					});
				});
			});
		</script>
	</head>
	
	<body>
	
		<h1>jquery.cursoricon.js demo</h1>

		<table>
			<tbody>
				<tr>
					<td id="ui-icon-plus">ui-icon-plus</td>
					<td id="ui-icon-star">ui-icon-star</td>
					<td id="ui-icon-check">ui-icon-check</td>
				</tr>
			</tbody>
		</table>
		
	</body>
</html>